<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>js控制Css</title>
		<style>
			div{
				border-radius: 50%;
				border: 2px solid red;
				overflow: hidden;
				width: 499px;
			}
			.b{
				background-color: aqua;
			}
			.b2{
				background-color: bisque;
			}
		</style>
		<script>
			function changeImg(d){
				d.classList.remove("b2");
				d.classList.add("b");
			}
			function leaseImg(d){
				d.classList.remove("b");
				d.classList.add("b2");
			}
		</script>
	</head>
	<body>
		<div onmouseover="changeImg(this)" onmouseout="leaseImg(this)">
			<img src="../image/kongzi.jpg"/>
		</div>
		
	</body>
</html>